<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title></title>
    <!-- mui-css -->
    <link href="css/mui.min.css" rel="stylesheet"/>
    <!-- social1 css -->
    <link href="css/social1.css" rel="stylesheet" />
</head>
<body>
    <header class="mui-bar mui-bar-nav">
        <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
        <h1 class="mui-title">Social</h1>
        <a class="mui-icon mui-icon-more-filled"></a>
    </header>
    
    <div class="mui-content">
    	<div class="mui-input-row mui-search">
	        <input type="search" class="mui-input-clear" placeholder="Erick Adwos">
	    </div>
	    
	    <ul class="mui-table-view mui-grid-view">
	        <li class="mui-table-view-cell mui-media mui-col-xs-4">
	            <a href="#">
	                <img class="mui-media-object" src="img/1-1.png">
	                <div class="mui-media-body">Maria</div>
	            </a>
	        </li>
	        <li class="mui-table-view-cell mui-media mui-col-xs-4 round2">
	            <a href="#">
	                <img class="mui-media-object" src="img/1-2.png">
	                <div class="mui-media-body">Adam</div>
	            </a>
	        </li>
	        <li class="mui-table-view-cell mui-media mui-col-xs-4 round3">
	            <a href="#">
	                <img class="mui-media-object" src="img/1-3.png">
	                <div class="mui-media-body">Karry</div>
	            </a>
	        </li>
	        <li class="mui-table-view-cell mui-media mui-col-xs-4 round4">
	            <a href="#">
	                <img class="mui-media-object" src="img/1-4.png">
	                <div class="mui-media-body">Yaroslav</div>
	            </a>
	        </li>
	        <li class="mui-table-view-cell mui-media mui-col-xs-4">
	            <a href="#">
	                <img class="mui-media-object" src="img/1-5.png">
	                <div class="mui-media-body">Alisa</div>
	            </a>
	        </li>
	        <li class="mui-table-view-cell mui-media mui-col-xs-4 round6">
	            <a href="#">
	                <img class="mui-media-object" src="img/1-6.png">
	                <div class="mui-media-body">Kristian</div>
	            </a>
	        </li>
	        <li class="mui-table-view-cell mui-media mui-col-xs-4 round7">
	            <a href="#">
	                <img class="mui-media-object" src="img/1-7.png">
	                <div class="mui-media-body">Tony</div>
	            </a>
	        </li>
	        <li class="mui-table-view-cell mui-media mui-col-xs-4 round8">
	            <a href="#">
	                <img class="mui-media-object" src="img/1-8.png">
	                <div class="mui-media-body">Erick</div>
	            </a>
	        </li>
	        <li class="mui-table-view-cell mui-media mui-col-xs-4">
	            <a href="#">
	                <img class="mui-media-object" src="img/1-9.png">
	                <div class="mui-media-body">Madalena</div>
	            </a>
	        </li>
	    </ul>
	    
	    
    </div>
    
    
	<script src="js/mui.min.js"></script>
    <script type="text/javascript" charset="utf-8">
      	mui.init();
    </script>
</body>
</html>